<template>
  <div>
    <el-form-item :label="i18nt('designer.setting.aliasName')" prop="label" :rules="[{
          required: this.isRequired,
        }]">
      <el-input
        type="text"
        v-model="optionModel.aliasName"
        @change="updateLabel"
      ></el-input>
    </el-form-item>
  </div>
</template>

<script>
import i18n from "@/utils/i18n"

export default {
  name: "aliasName-editor",
  mixins: [i18n],
  props: {
    designer: Object,
    selectedWidget: Object,
    optionModel: Object,
    globalDsv: Object,
  },
  inject: ["isSubFormChildWidget"],
  computed: {
    isRequired() {
      // 获取字段组件标识 非字段组件 别名非必填
      const { formItemFlag } = this.designer.selectedWidget || {};
      // 获取全局验证配置
      const required  = this.globalDsv.validationConfig ? this.globalDsv.validationConfig["aliasName"] : false;
      return formItemFlag && required
    }
  },

  methods: {
    updateLabel(newName) {
      if (
        this.selectedWidget.type === "sub-form" ||
        this.selectedWidget.type === "grid-sub-form"
      ) {
        this.$message.info("请输入组件别名")
        return
      }
    },
  },
}
</script>

<style scoped></style>
